<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="../mycss/wf_css/wf_xiadan.css">
    <script src="wf_apply.js"></script>
    <title>社区商城测试项目</title>
</head>
<body>
    <!-- 头div -->
    <div class="head">
        <div class="ul1">
            <ul>
                <li >当前位置：</li>
                <li>></li>
                <li>中环大厦</li>
                <li>></li>
                <li>魏家凉皮</li>
                <li>></li>
                <li>订单信息</li>
                <div class="ul11">
                    <a href="#">登录</a>
                    <a href="#">注册</a>
                    <div class="ul000">
                        <img src="../../img/wf/xiajiantou.png" alt=""/>
                        <div class="u110">
                            <div>
                                <div>
                                    <img class="xtimg" src="../../img/wf/hengtiao.png" alt=""/>
                                </div>
                                <span class="xtspan">个人中心</span>
                            </div>
                            <hr/>

                            <div>
                                <div>
                                    <img class="xtimg1" src="../../img/wf/hengtiao.png" alt=""/>
                                </div>
                                <span class="xtspan">我的收藏</span>
                            </div>
                            <hr/>

                            <div>
                                <div>
                                    <img class="xtimg2" src="../../img/wf/hengtiao.png" alt=""/>
                                </div>
                                <span class="xtspan">我的地址</span>
                            </div>
                            <hr/>

                            <div>
                                <div>
                                    <img class="xtimg3" src="../../img/wf/hengtiao.png" alt=""/>
                                </div>
                                <span class="xtspan">安全设置</span>
                            </div>
                            <hr/>

                            <div>
                                <div>
                                    <img class="xtimg4" src="../../img/wf/hengtiao.png" alt=""/>
                                </div>
                                <span class="xtspan">退出登录</span>
                            </div>

                        </div>
                    </div>
                    <span></span>
                </div>
            </ul>

        </div>
        <!--右侧登录-->

    </div>
    <hr/>
    <!--导航栏紧挨着的头框-->
    <div class="second">
        <div class="div2">
            <h1>社区商城</h1>
            <div>|  订单信息</div>
        </div>
    </div>
    <!--主体内容-->
    <!--左半部分-->
    <div class="content2">
        <div class="zuok">
            <div class="zuo1">
                <h3>订单详情</h3>
                <a href="#">< 返回商家修改</a>
            </div>
            <hr/>
            <div class="zuo2">
                <span>商品</span>
                <span>份数</span>
                <span>小计(元)</span>
                <h4>1号购物车</h4>
            </div>
            <hr/>
            <div class="zuo3" id="price">
                <span>肉夹馍</span>
                <div>
                    <button>-</button>
                    <input type="text" value="5"/>
                    <button>+</button>
                </div>
                <span>￥18.00</span>
            </div>
            <hr/>
            <div class="zuo3">
                <span>牛筋面</span>
                <div>
                    <button>-</button>
                    <input type="text" value="1"/>
                    <button>+</button>
                </div>
                <span>￥18.00</span>
            </div>
            <hr/>
            <div class="zuo3">
                <span>炒拉条</span>
                <div>
                    <button>-</button>
                    <input type="text" value="5"/>
                    <button>+</button>
                </div>
                <span>￥18.00</span>
            </div>
            <hr/>
            <div class="zuo3">
                <span>盖浇饭</span>
                <div>
                    <button>-</button>
                    <input type="text" value="1"/>
                    <button>+</button>
                </div>
                <span>￥18.00</span>
            </div>
            <div class="psf">
                <span>配送费</span>
                <span>￥1.10</span>
            </div>
            <div class="ch">
                <span>餐盒</span>
                <span>￥40.00</span>
            </div>
            <!--价格总计-->
            <div class="zongji">
                ￥495.10
            </div>
            <div class="zongji1">
                共42份商品
            </div>

        </div>
        <!--右半部分-->
        <div class="youk">
            <div class="shdz">
                <h3>收货地址</h3>
                <a href="#">添加新地址</a>
            </div>
            <div class="kuang">
                <img class="dizhi1" src="../../img/wf/dizhi.png" alt=""/>
                <span>|</span>
                <a href="#">修改地址✖</a>
            </div>
            <div class="shdz1">
                <h3>付款方式</h3>
            </div>
            <div class="kuang1">
                <p>在线支付</p>
                <p>支持微信、支付宝以及大部分银行卡</p>
            </div>
            <div class="shdz1">
                <h3>选择优惠</h3>
                <div class="shdz2">
                    <span>使用红包</span>
                    <span class="hb">无可用红包</span>
                </div>
                <div class="shdz3">
                    <span>使用优惠券</span>
                    <span class="hb">网站不支持</span>
                    <span>(仅手机客户端可使用)</span>
                </div>

            </div>
            <div class="shdz4">
                <h3>其他信息</h3>
                <div>
                    <span>配送方式</span>
                    <span class="hb">本订单[蜂鸟转送]提供配送</span>
                </div>
                <div>
                    <span>送达时间</span>
                    <span class="mqsj"></span>
                </div>
                <div>
                    <span>发票信息</span>
                    <span class="hb">仅在app中支持发票</span>
                </div>
                <div>
                    <span>订单备注</span>
                    <input class="input" type="text" value="不要麻不要辣"/>
                </div>
                <div>
                    <span>餐具分数</span>
                    <span>本订单</span>
                </div>
                <button>确认下单</button>
               <div class="hb0">
                   <div class="hb1">扫码下载app立享优惠</div>
                   <div>
                       <img class="hhh" src="../../img/wf/erweima.png" alt=""/>
                   </div>
               </div>
            </div>

        </div>
    </div>
    <!--左侧隐藏图-->
    <!-- <div class="zcyct">
        <img src="../../img/wf/timg.jpg" alt=""/>
    </div> -->
    <!--底部-->


</body>
<foot>
    <iframe src="./wf_bottom.html" class="dibu" frameborder="0"></iframe>
</foot>
<script>
    /*添加时间*/
    var fun1=function(){
        var time=new Date();
        var dizhi=document.querySelector("div.shdz4>div>span.mqsj");
        dizhi.innerHTML=time.toLocaleString();
    }
    fun1();
    setInterval(fun1,1000);
    /*二维码的隐藏*/
    var f=document.querySelector("div.hb0");
    var a=document.querySelector("div.hb0>div.hb1");
    var b=document.querySelector("div.hb0>div:last-child");
        a.onmouseover=function(){
            b.style.display="block"
        };
    a.onmouseout=function(){
        b.style.display="none"
    };
    /*修改地址的隐藏*/
    var xgdz=document.querySelector("div.kuang");
    var xgdz1=document.querySelector("div.kuang>a");
    xgdz.onmouseover=function(){
        xgdz1.style.display="inline-block";
    }
    xgdz.onmouseout=function(){
        xgdz1.style.display=""
    }


</script>
<!-- //购物车计算总价直接用dom计算，选择器属性直接定位 -->
<script src="../js/jquery-3.2.1.js"></script>
<script src="./wf_apply.js"></script>
</html>